<!DOCTYPE html>
<html>
<head lang="en">
  <meta charset="UTF-8">
  <meta name="viewport" content="device=device-width">
<title>doc</title>
<style>
	.box{
		width: 450px;
		margin: 50px auto;
	}
    #adverImg {
	width:430px;
	height:130px;
	position:relative;
	overflow:hidden;
}
#number {
	position:absolute;
	right:5px;
	bottom:2px;
}
#number ul, #number li {
	margin:0px;
	padding:0px;
}
#number li {
	float:left;
	margin-right:5px;
	width:20px;
	height:20px;
	border:1px #666 solid;
	text-align:center;
	line-height:20px;
	font-size:12px;
	list-style-type:none;
	background-color:#FFF;
}
</style>
</head>
<body>
    <a href="xq.html">作业一</a>
    <a href="demo.html">作业二</a>
    <a href="index.html">作业三</a>
    <a href="string.html">作业四</a>
    <a href="temp.html">作业五</a>
	<div class="box">
		<div id="adverImg"><img src="image/adver-01.jpg" alt="夏日商品促销" />
			<div id="number">
			  <ul>
				<li>1</li>
				<li>2</li>
				<li>3</li>
				<li>4</li>
				<li>5</li>
			  </ul>
			</div>
		  </div>
	</div>

</body>
</html>